/* 首屏动画 */
.website-baner{
  background: #F6F6FF;
  width: 100%;
  height: 100vh;
  min-height: 796px;
  min-width: 1920px;
  position: relative;
  left: 50%;
  -webkit-transform: translateX(-50%);
     -moz-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
       -o-transform: translateX(-50%);
          transform: translateX(-50%);
}
.website-top{
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  width: 100%;
  z-index: 99;
}
.website-ball{
  width: 100%;
  height: 100%;
  min-height: 796px;
  position: relative;
  overflow: hidden;
  padding-top: 140px;
}
.common-img,
.common-video {
  width: 100%;
  vertical-align: top
}
.common-img-bg {
  -o-background-size: cover;
  background-size: cover;
  background-repeat: no-repeat
}
.commom-ball {
  position: absolute
}
.commom-ball-hidden {
  -webkit-backface-visibility: hidden
}
/* 首屏第1个图片动画 */
.commom-ball-lt1 {
  top:0;
  left:0;
  -webkit-animation: ball-lt1 3s 0s infinite alternate;
     -moz-animation: ball-lt1 3s 0s infinite alternate;
       -o-animation: ball-lt1 3s 0s infinite alternate;
          animation: ball-lt1 3s 0s infinite alternate
}

.commom-ball-1 {
  width: 793px;
  height: 422px;
  background-image: url(../images/circle_1.png);
  -webkit-animation: ball-1 1.8s -.4s both;
     -moz-animation: ball-1 1.8s -.4s both;
       -o-animation: ball-1 1.8s -.4s both;
          animation: ball-1 1.8s -.4s both
}
@-webkit-keyframes ball-lt1 {
  0% {
    -webkit-transform: translate3d(0,-5%,0);
            transform: translate3d(0,-5%,0)
  }

  100% {
    -webkit-transform: translate3d(0,5%,0);
            transform: translate3d(0,5%,0)
  }
}
@-moz-keyframes ball-lt1 {
  0% {
    -moz-transform: translate3d(0,-5%,0);
         transform: translate3d(0,-5%,0)
  }

  100% {
    -moz-transform: translate3d(0,5%,0);
         transform: translate3d(0,5%,0)
  }
}
@-o-keyframes ball-lt1 {
  0% {
    transform: translate3d(0,-5%,0)
  }

  100% {
    transform: translate3d(0,5%,0)
  }
}
@keyframes ball-lt1 {
  0% {
    -webkit-transform: translate3d(0,-5%,0);
       -moz-transform: translate3d(0,-5%,0);
            transform: translate3d(0,-5%,0)
  }

  100% {
    -webkit-transform: translate3d(0,5%,0);
       -moz-transform: translate3d(0,5%,0);
            transform: translate3d(0,5%,0)
  }
}
@-webkit-keyframes ball-1 {
  0% {
    -webkit-transform: translate3d(0, -400px, 0);
            transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
@-moz-keyframes ball-1 {
  0% {
    -moz-transform: translate3d(0, -400px, 0);
         transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
@-o-keyframes ball-1 {
  0% {
    transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
@keyframes ball-1 {
  0% {
    -webkit-transform: translate3d(0, -400px, 0);
       -moz-transform: translate3d(0, -400px, 0);
            transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
/* 首屏第2个图片动画 */
.commom-ball-lt2 {
  top: 240px;
  right:444px;
  -webkit-animation: ball-lt2 3s 0s infinite alternate;
     -moz-animation: ball-lt2 3s 0s infinite alternate;
       -o-animation: ball-lt2 3s 0s infinite alternate;
          animation: ball-lt2 3s 0s infinite alternate
}

.commom-ball-2 {
  width: 140px;
  height: 140px;
  z-index: 2;
  background-image: url(../images/circle_4.png);
  -webkit-animation: ball-2 1.8s -.4s both;
     -moz-animation: ball-2 1.8s -.4s both;
       -o-animation: ball-2 1.8s -.4s both;
          animation: ball-2 1.8s -.4s both
}
@-webkit-keyframes ball-lt2 {
  0% {
    -webkit-transform: translate3d(-5%,0, 0);
            transform: translate3d(-5%,0, 0)
  }

  100% {
    -webkit-transform: translate3d(5%,0, 0);
            transform: translate3d(5%,0, 0)
  }
}
@-moz-keyframes ball-lt2 {
  0% {
    -moz-transform: translate3d(-5%,0, 0);
         transform: translate3d(-5%,0, 0)
  }

  100% {
    -moz-transform: translate3d(5%,0, 0);
         transform: translate3d(5%,0, 0)
  }
}
@-o-keyframes ball-lt2 {
  0% {
    transform: translate3d(-5%,0, 0)
  }

  100% {
    transform: translate3d(5%,0, 0)
  }
}
@keyframes ball-lt2 {
  0% {
    -webkit-transform: translate3d(-5%,0, 0);
       -moz-transform: translate3d(-5%,0, 0);
            transform: translate3d(-5%,0, 0)
  }

  100% {
    -webkit-transform: translate3d(5%,0, 0);
       -moz-transform: translate3d(5%,0, 0);
            transform: translate3d(5%,0, 0)
  }
}

@-webkit-keyframes ball-2 {
  0% {
    -webkit-transform: translate3d(0, -400px, 0);
            transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-moz-keyframes ball-2 {
  0% {
    -moz-transform: translate3d(0, -400px, 0);
         transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-o-keyframes ball-2 {
  0% {
    transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@keyframes ball-2 {
  0% {
    -webkit-transform: translate3d(0, -400px, 0);
       -moz-transform: translate3d(0, -400px, 0);
            transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
/* 首屏第3个图片动画 */
.commom-ball-lt3 {
  top: 240px;
  right: 349px;
  z-index: 1;
  -webkit-animation: ball-lt3 3s 0s infinite alternate;
     -moz-animation: ball-lt3 3s 0s infinite alternate;
       -o-animation: ball-lt3 3s 0s infinite alternate;
          animation: ball-lt3 3s 0s infinite alternate
}

.commom-ball-3 {
  width: 140px;
  height: 140px;
  background-image: url(../images/circle_5.png);
  -webkit-animation: ball-3 1.8s -.4s both;
     -moz-animation: ball-3 1.8s -.4s both;
       -o-animation: ball-3 1.8s -.4s both;
          animation: ball-3 1.8s -.4s both
}
@-webkit-keyframes ball-lt3 {
  0% {
    -webkit-transform: translate3d(5%,0, 0);
            transform: translate3d(5%,0, 0)
  }

  100% {
    -webkit-transform: translate3d(-5%,0, 0);
            transform: translate3d(-5%,0, 0)
  }
}
@-moz-keyframes ball-lt3 {
  0% {
    -moz-transform: translate3d(5%,0, 0);
         transform: translate3d(5%,0, 0)
  }

  100% {
    -moz-transform: translate3d(-5%,0, 0);
         transform: translate3d(-5%,0, 0)
  }
}
@-o-keyframes ball-lt3 {
  0% {
    transform: translate3d(5%,0, 0)
  }

  100% {
    transform: translate3d(-5%,0, 0)
  }
}
@keyframes ball-lt3 {
  0% {
    -webkit-transform: translate3d(5%,0, 0);
       -moz-transform: translate3d(5%,0, 0);
            transform: translate3d(5%,0, 0)
  }

  100% {
    -webkit-transform: translate3d(-5%,0, 0);
       -moz-transform: translate3d(-5%,0, 0);
            transform: translate3d(-5%,0, 0)
  }
}

@-webkit-keyframes ball-3 {
  0% {
    -webkit-transform: translate3d(0, -400px, 0);
            transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-moz-keyframes ball-3 {
  0% {
    -moz-transform: translate3d(0, -400px, 0);
         transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-o-keyframes ball-3 {
  0% {
    transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@keyframes ball-3 {
  0% {
    -webkit-transform: translate3d(0, -400px, 0);
       -moz-transform: translate3d(0, -400px, 0);
            transform: translate3d(0, -400px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
/* 首屏第4个图片动画 */
.commom-ball-lt4 {
  left: 196px;
  bottom: 130px;
  z-index: 2;
  -webkit-animation: ball-lt4 3s 0s infinite alternate;
     -moz-animation: ball-lt4 3s 0s infinite alternate;
       -o-animation: ball-lt4 3s 0s infinite alternate;
          animation: ball-lt4 3s 0s infinite alternate
}

.commom-ball-4 {
  width: 200px;
  height: 200px;
  background-image: url(../images/circle_2.png);
  -webkit-animation: ball-4 1.8s -.4s both;
     -moz-animation: ball-4 1.8s -.4s both;
       -o-animation: ball-4 1.8s -.4s both;
          animation: ball-4 1.8s -.4s both
}
@-webkit-keyframes ball-lt4 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}
@-moz-keyframes ball-lt4 {
  0% {
    -moz-transform: translate3d(0,5%, 0);
         transform: translate3d(0,5%, 0)
  }

  100% {
    -moz-transform: translate3d(0,-5%, 0);
         transform: translate3d(0,-5%, 0)
  }
}
@-o-keyframes ball-lt4 {
  0% {
    transform: translate3d(0,5%, 0)
  }

  100% {
    transform: translate3d(0,-5%, 0)
  }
}
@keyframes ball-lt4 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
       -moz-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
       -moz-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}

@-webkit-keyframes ball-4 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-moz-keyframes ball-4 {
  0% {
    -moz-transform: translate3d(0, 600px, 0);
         transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-o-keyframes ball-4 {
  0% {
    transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@keyframes ball-4 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
       -moz-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
/* 首屏第5个图片动画 */
.commom-ball-lt5 {
  left: 329px;
  bottom: 80px;
  z-index: 1;
  -webkit-animation: ball-lt5 3s 0s infinite alternate;
     -moz-animation: ball-lt5 3s 0s infinite alternate;
       -o-animation: ball-lt5 3s 0s infinite alternate;
          animation: ball-lt5 3s 0s infinite alternate
}

.commom-ball-5 {
  width: 300px;
  height: 300px;
  background-image: url(../images/circle_3.png);
  -webkit-animation: ball-5 1.8s -.4s both;
     -moz-animation: ball-5 1.8s -.4s both;
       -o-animation: ball-5 1.8s -.4s both;
          animation: ball-5 1.8s -.4s both
}
@-webkit-keyframes ball-lt5 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}
@-moz-keyframes ball-lt5 {
  0% {
    -moz-transform: translate3d(0,5%, 0);
         transform: translate3d(0,5%, 0)
  }

  100% {
    -moz-transform: translate3d(0,-5%, 0);
         transform: translate3d(0,-5%, 0)
  }
}
@-o-keyframes ball-lt5 {
  0% {
    transform: translate3d(0,5%, 0)
  }

  100% {
    transform: translate3d(0,-5%, 0)
  }
}
@keyframes ball-lt5 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
       -moz-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
       -moz-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}

@-webkit-keyframes ball-5 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-moz-keyframes ball-5 {
  0% {
    -moz-transform: translate3d(0, 600px, 0);
         transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@-o-keyframes ball-5 {
  0% {
    transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    transform: translate3d(0, 0, 0);
    opacity: 1
  }
}

@keyframes ball-5 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
       -moz-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
    opacity: 1
  }
}
/* 首屏第6个图片动画 */
.commom-ball-lt6 {
  right: 114px;
  bottom: 0;
  z-index: 1;
  -webkit-animation: ball-lt6 3s 0s infinite alternate;
     -moz-animation: ball-lt6 3s 0s infinite alternate;
       -o-animation: ball-lt6 3s 0s infinite alternate;
          animation: ball-lt6 3s 0s infinite alternate
}

.commom-ball-6 {
  width: 712px;
  height: 254px;
  background-image: url(../images/circle_7.png);
  -webkit-animation: ball-6 1.8s -.4s both;
     -moz-animation: ball-6 1.8s -.4s both;
       -o-animation: ball-6 1.8s -.4s both;
          animation: ball-6 1.8s -.4s both
}
@-webkit-keyframes ball-lt6 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}
@-moz-keyframes ball-lt6 {
  0% {
    -moz-transform: translate3d(0,5%, 0);
         transform: translate3d(0,5%, 0)
  }

  100% {
    -moz-transform: translate3d(0,-5%, 0);
         transform: translate3d(0,-5%, 0)
  }
}
@-o-keyframes ball-lt6 {
  0% {
    transform: translate3d(0,5%, 0)
  }

  100% {
    transform: translate3d(0,-5%, 0)
  }
}
@keyframes ball-lt6 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
       -moz-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
       -moz-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}

@-webkit-keyframes ball-6 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 5%, 0);
            transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}

@-moz-keyframes ball-6 {
  0% {
    -moz-transform: translate3d(0, 600px, 0);
         transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -moz-transform: translate3d(0, 5%, 0);
         transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}

@-o-keyframes ball-6 {
  0% {
    transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}

@keyframes ball-6 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
       -moz-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 5%, 0);
       -moz-transform: translate3d(0, 5%, 0);
            transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}
/* 首屏第7个图片动画 */
.commom-ball-lt7 {
  right: 0;
  bottom: 0;
  z-index: 0;
  -webkit-animation: ball-lt7 3s 0s infinite alternate;
     -moz-animation: ball-lt7 3s 0s infinite alternate;
       -o-animation: ball-lt7 3s 0s infinite alternate;
          animation: ball-lt7 3s 0s infinite alternate
}

.commom-ball-7 {
  width: 350px;
  height: 224px;
  background-image: url(../images/circle_6.png);
  -webkit-animation: ball-7 1.8s -.4s both;
     -moz-animation: ball-7 1.8s -.4s both;
       -o-animation: ball-7 1.8s -.4s both;
          animation: ball-7 1.8s -.4s both
}
@-webkit-keyframes ball-lt7 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}
@-moz-keyframes ball-lt7 {
  0% {
    -moz-transform: translate3d(0,5%, 0);
         transform: translate3d(0,5%, 0)
  }

  100% {
    -moz-transform: translate3d(0,-5%, 0);
         transform: translate3d(0,-5%, 0)
  }
}
@-o-keyframes ball-lt7 {
  0% {
    transform: translate3d(0,5%, 0)
  }

  100% {
    transform: translate3d(0,-5%, 0)
  }
}
@keyframes ball-lt7 {
  0% {
    -webkit-transform: translate3d(0,5%, 0);
       -moz-transform: translate3d(0,5%, 0);
            transform: translate3d(0,5%, 0)
  }

  100% {
    -webkit-transform: translate3d(0,-5%, 0);
       -moz-transform: translate3d(0,-5%, 0);
            transform: translate3d(0,-5%, 0)
  }
}

@-webkit-keyframes ball-7 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 5%, 0);
            transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}

@-moz-keyframes ball-7 {
  0% {
    -moz-transform: translate3d(0, 600px, 0);
         transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -moz-transform: translate3d(0, 5%, 0);
         transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}

@-o-keyframes ball-7 {
  0% {
    transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}

@keyframes ball-7 {
  0% {
    -webkit-transform: translate3d(0, 600px, 0);
       -moz-transform: translate3d(0, 600px, 0);
            transform: translate3d(0, 600px, 0);
    opacity: 0
  }

  100% {
    -webkit-transform: translate3d(0, 5%, 0);
       -moz-transform: translate3d(0, 5%, 0);
            transform: translate3d(0, 5%, 0);
    opacity: 1
  }
}

/* 首屏中间动画 */


.website-center{
  position: absolute;
  width: 1100px;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%,-50%);
     -moz-transform: translate(-50%,-50%);
      -ms-transform: translate(-50%,-50%);
       -o-transform: translate(-50%,-50%);
          transform: translate(-50%,-50%);
  z-index: 5;
  margin-top: 70px;
}
.website-center-logo{
  width: 354px;
  height: 250px;
  position: relative;
  margin: 0 auto;
  opacity: 0;
  -webkit-animation: logo_opaAn 1s 1.6s both;
     -moz-animation: logo_opaAn 1s 1.6s both;
       -o-animation: logo_opaAn 1s 1.6s both;
          animation: logo_opaAn 1s 1.6s both;
}
.website-center-logo div{
    width: 354px;
    height: 250px;
    background-repeat: no-repeat;
    -o-background-size: 354px 250px;
       background-size: 354px 250px;
    position: absolute;
    top: 0;
    left: 0;
    background-image: url(../images/3.0.png);
    /* animation: flyme7_logoAn 1.2s 3.2s steps(20,end) forwards; */
}
@-webkit-keyframes logo_opaAn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
  }
}
@-moz-keyframes logo_opaAn {
  0% {
    opacity: 0;
    -moz-transform: translate3d(0, 100%, 0);
         transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
  }
}
@-o-keyframes logo_opaAn {
  0% {
    opacity: 0;
    transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0)
  }
}
@keyframes logo_opaAn {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
       -moz-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
  }
}
/* 
@keyframes flyme7_logoAn {
  0% {
    background-position: 0 0
  }

  100% {
    background-position: -2200px 0
  }
} */


.website-center-text{
  font-size: 58px;
  color: #333333;
  letter-spacing: 2px;
  text-align: center;
  margin-top: 22px;
  margin-bottom: 100px;
  opacity: 0;
  -webkit-animation: website-text .8s 2s forwards;
     -moz-animation: website-text .8s 2s forwards;
       -o-animation: website-text .8s 2s forwards;
          animation: website-text .8s 2s forwards;
}
@-webkit-keyframes website-text {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
  }
}
@-moz-keyframes website-text {
  0% {
    opacity: 0;
    -moz-transform: translate3d(0, 100%, 0);
         transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    -moz-transform: translate3d(0, 0, 0);
         transform: translate3d(0, 0, 0)
  }
}
@-o-keyframes website-text {
  0% {
    opacity: 0;
    transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0)
  }
}
@keyframes website-text {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
       -moz-transform: translate3d(0, 100%, 0);
            transform: translate3d(0, 100%, 0)
  }

  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0)
  }
}


.website-center-video .main-video-menu{
  position: initial!important;
  bottom: 0!important;
  left: 0!important;
  -webkit-transform: translateX(0)!important;
     -moz-transform: translateX(0)!important;
      -ms-transform: translateX(0)!important;
       -o-transform: translateX(0)!important;
          transform: translateX(0)!important;
  cursor: pointer;
  color: rgba(68, 157, 248, 1);
  font-size: 26px;
  color: #449DF8;
  height: 40px;
  line-height: 40px;
  opacity: 0;
  -webkit-animation: website-text .8s 2.4s forwards;
     -moz-animation: website-text .8s 2.4s forwards;
       -o-animation: website-text .8s 2.4s forwards;
          animation: website-text .8s 2.4s forwards;
}

.website-center-video .main-video-menu1 , .website-center-video .main-video-menu2{
  margin-top:15px;
  position: initial!important;
  bottom: 0!important;
  left: 0!important;
  -webkit-transform: translateX(0)!important;
     -moz-transform: translateX(0)!important;
      -ms-transform: translateX(0)!important;
       -o-transform: translateX(0)!important;
          transform: translateX(0)!important;
  cursor: pointer;
  color: rgba(68, 157, 248, 1);
  font-size: 18px;
  color: #449DF8;
  height: 30px;
  line-height: 30px;
  opacity: 0;
  -webkit-animation: website-text 1s 2.4s forwards;
     -moz-animation: website-text 1s 2.4s forwards;
       -o-animation: website-text 1s 2.4s forwards;
          animation: website-text 1s 2.4s forwards;
}
.website-center-video {
  text-align: center;
}

